<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script src="${pageContext.request.contextPath}/js/jquery-1.8.3.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
   //全选
	$("#chkAll").click(function(){
		$("[name=id]:checkbox").each( function(){
			if(  $("#chkAll").attr("checked") =="checked" )
				$(this).attr("checked",$("#chkAll").attr("checked"));
			else
				$(this).removeAttr("checked");
			
		} );
	});

	//删除按钮
	$("#btn1").click(function(){ 
		if(  $("[name=id]:checkbox:checked").length ==0){
			alert("请选择删除的员工编号");
		}else{
			var ids = "";//存储选择的 id值 
			$("[name=id]:checkbox:checked").each(function(){
				ids+=$(this).attr("value")+",";
			});
			alert(ids.substring(0,ids.length-1));
			ids = ids.substring(0,ids.length-1);
			$.post( "deleteEmp",
						{id: ids },
						function(data){
							$("#tab tr:gt(1)").remove();//删除表格原有行
							for(var i=0; i<data.length; i++){
								//创建行
								var $tr=$("<tr></tr>");
								//添加列
								$tr.append( $("<td><input type='checkbox' name='id' value='"+data[i].id+"'></td>") );
								$tr.append( $("<td>" +data[i].id+"</td>") );
								$tr.append( $("<td>" +data[i].ename+"</td>") );
								$tr.append( $("<td>" +data[i].job+"</td>") );
								$tr.append( $("<td>" +data[i].sal+"</td>") );
								$tr.append( $("<td>" +data[i].hiredate+"</td>") );
								$tr.append( $("<td>" +data[i].deptNo+"</td>") );
								//把行添加到表格
								$("#tab").append($tr);
							}
							
						}
			);
			
		}
		
		
	});
});
</script>
</head>
<body>

<form action="dept.do" method="post">
<table id="tab" border="1px" align="center" style="border-collapse: collapse;" cellpadding="5px" width="600px">
   <tr><td colspan="7"><input type="button" id="btn1" value="删除"></td></tr>
	<tr>
		<th><input type="checkbox" id="chkAll" >全选</th>
		<th>编号</th>
		<th>姓名</th>
		<th>工作</th>
		<th>薪水</th>
		<th>雇佣日期</th>
		<th>部门编号</th>
	</tr>

<c:forEach items="${list}" var="e" >
<tr>
<td><input type="checkbox" name="id" value="${e.id }"></td>
<td>${e.id }</td>
<td>${e.ename }</td>
<td>${e.job }</td>
<td>${e.sal }</td>
<td><fmt:formatDate value="${e.hiredate }" pattern="yyyy-MM-dd HH:mm:ss"/></td>
<td>${e.deptNo }</td>
</tr>
</c:forEach>

</table>
</form>
</body>
</html>